<template>
  <div>
    组页面
    <!-- <Button v-loading="loading" /> -->
    <button @click="router.push('/login')">登陆页面</button>
    <button @click="backHandle">退出登录</button>
    <button @click="router.push('/main/role/addRole')">角色管理</button>
    <button @click="router.push('/main')">main管理</button>
    <tiny-tabs v-model="activeName">
      <tiny-tab-item :key="item.name" v-for="item in tabs" :title="item.title" :name="item.name">
      </tiny-tab-item>
    </tiny-tabs>
  </div>
</template>

<script setup lang="ts">
import { reactive, ref } from 'vue';
import { useRouter } from 'vue-router';
const loading = ref(true);
setTimeout(() => {
  loading.value = false;
}, 2000);
const activeName = ref('1');
const tabs = reactive([]);

// 创建 tabs
for (let i = 1; i < 6; i++) {
  const title = `Tab ${i}`;
  tabs.push({
    title,
    name: i + '',
    content: `${title} content `,
  });
}
const router = useRouter();
const params = ref({
  header: '123',
  content: '123',
  footer: 'footer',
  content1: 'content1',
  content2: 'content2',
  content3: 'content3',
});
const backHandle = () => {
  localStorage.clear();
  window.location.reload();
  router.clearRoutes();
};
</script>

<style scoped></style>
